* {
	box-sizing: border-box;
}

body {
	background: url("../ionbackgroundeditAsset 11.png") no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center;
}
.text{
    color: black!important;
    
    font-family: "Roboto";
    font-size: 22px;
    float:right;
    text-align:right;
    margin-right: 80px;
    position: relative;
    margin-top:-50px;

  }

.logo {
  text-align: center;
  font-family: "Roboto";
	font-size: 30px;
	font-weight: 400;
  padding-top: 200px;
  margin: 0 15px;
}

.row:before, .row:after { display: inline-block !important; }


#button {
  padding: 10px;
	font-family: "Roboto";
	font-weight: 400;
	color: #000;
  font-size: 24px;
  border-radius: 50px;
	background: linear-gradient(145deg, #fefefe, #d5d5d5);
	box-shadow: 6px 6px 16px #8c8c8c, -6px -6px 16px #ffffff;
  text-decoration: none;
  margin: 20px auto;

}

#button:hover {
	background: linear-gradient(145deg, #d5d5d5, #fefefe);
	box-shadow: 6px 6px 16px #8c8c8c, -6px -6px 16px #ffffff;
}

#button:active {
	background: #ededed;
	box-shadow: inset 6px 6px 16px #8c8c8c, inset -6px -6px 16px #ffffff;
}

@media only screen and (max-width: 500px) {

	.logo{
		font-size: 16px;
    padding-top: 150px;
	}
.text{
    color: black!important;
    
    font-family: "Roboto";
    font-size: 18px;
   
    text-align:center;
    margin-top: 55px;
    position: relative;
    margin-right:15px;
    margin-left:auto;
    

  }

	#button{
		font-size: 15px;
	}
}

@media only screen and (min-device-width: 501px) and (max-device-width: 800px) {

	.logo{
		font-size: 25px;
		color: rgb(77, 77, 77);
    padding-top: 200px;
	}

	#button h2 {
		font-size: 25px;
	}
.text{
    color: black!important;
    
    font-family: "Roboto";
    font-size: 18px;
   
    text-align:center;
    margin-top: 55px;
    position: relative;
    margin-right:auto;
    margin-left:auto;
    

  }

}